<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>挺赞社区管家</title>
	<meta name="keywords" content="" />
	<meta name="description" content="" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">
	<link rel="stylesheet" href="__PUBLIC__/client/css/cui.css?sj={$tj}" />
	<link rel="stylesheet" href="__PUBLIC__/auntie/css/style.css?sj={$tj}" />
	<script type="text/javascript" src="__PUBLIC__/client/js/jquery.js"></script>
	<style>
		

	</style>
</head>
<body class="mhome">
	<div class="viewport">
        <!--<div class="sitemap">
            <a href="index.html" class="goback"></a>待收件
        </div>-->
        <!--end header-->
		<div id="bd" class="fix">
			
			<section class="service_price">
			<aside>
			<ul id="Categorie">
				<li class="sel" id="100100010001">
					<img class="nor" src="http://demo.paopaoxi.com/app/category/cloth_df_150_150.png?version=1">
					<img class="sel" src="http://demo.paopaoxi.com/app/category/cloth_sel_150_150.png?version=1">
						上衣
				</li>
				<li>
					<img class="nor" src="http://demo.paopaoxi.com/app/category/cloth_df_150_150.png?version=1">
					<img class="sel" src="http://demo.paopaoxi.com/app/category/cloth_sel_150_150.png?version=1">
						鞋子
				</li>
				<li>
					<img class="nor" src="http://demo.paopaoxi.com/app/category/cloth_df_150_150.png?version=1">
					<img class="sel" src="http://demo.paopaoxi.com/app/category/cloth_sel_150_150.png?version=1">
						包包
				</li>
				<li>
					<img class="nor" src="http://demo.paopaoxi.com/app/category/cloth_df_150_150.png?version=1">
					<img class="sel" src="http://demo.paopaoxi.com/app/category/cloth_sel_150_150.png?version=1">
						奢侈品
				</li>
				<li>
					<img class="nor" src="http://demo.paopaoxi.com/app/category/cloth_df_150_150.png?version=1">
					<img class="sel" src="http://demo.paopaoxi.com/app/category/cloth_sel_150_150.png?version=1">
						家纺
				</li>
			</aside>
			<ul class="price_ul sel">
				<li>												
						<div class="proInfo">					
							<p><b>衬衣</b>	</p>
						</div>
						<i class="add"></i>	
						
						<div class="bb-ydbox" style="margin-top: 10px; display: none;">
							<div class="bb-ydinfo">

							</div>
							 <a href="javascript:;" id="addyidaninfo" class="btn-yellow butt2 addyidaninfo">添加</a>
						</div>
				</li>
				<li>												
						<div class="proInfo">					
							<p><b>衬衣</b>	</p>
						</div>
						<i class="add"></i>	
						
						<div class="bb-ydbox" style="margin-top: 10px; display: none;">
							<div class="bb-ydinfo">

							</div>
							 <a href="javascript:;" id="addyidaninfo" class="btn-yellow butt2 addyidaninfo">添加</a>
						</div>
				</li>
				<li>												
						<div class="proInfo">					
							<p><b>衬衣</b>	</p>
						</div>
						<i class="add"></i>	
						
						<div class="bb-ydbox" style="margin-top: 10px; display: none;">
							<div class="bb-ydinfo">

							</div>
							 <a href="javascript:;" class="btn-yellow butt2 addyidaninfo" >添加</a>
						</div>
				</li>
			
			</section>
         </div>
		<!--end #bd-->
	</div>
	
	<button class="cart"><b><i class="bg">确认</i></b></button>
	
	<div class="clear"></div>
	<div id="order_bg"></div>
	<div id="address_box">
		<i class='close'>X</i>
		<ul id="address_box_ul">
				<li>
					<span><b class="fl"></b><b class="fr">12121</b></span>										
				    <div class="c"></div>
				</li>
		</ul>
	</div>
	
	
	<script src="__PUBLIC__/business/js/normal.js?sj={$tj}"></script>
	<script>
		$(function(){
			
			$('#order_bg').show();
			$('#address_box').show();
			
			var boxH = $('#address_box').height();
			$('#address_box').css('top',($(window).height()-boxH-40)/2);
			$('#address_box').css('width',$(window).width()-40);
			$('#address_box').css('left',20);
			//=========
			//添加衣单详情
			var ydhtml='<div class="bb-infobox"><div class="xuanzhe"><p>衬衣 <font class="red">¥8</font></p></div><i class="del" onclick="guanbi($(this))"></i><p class="ynum" onclick="xiachi($(this))"><span>瑕疵</span></p><p class="ynum"  onclick="fujian($(this))"><span>附件</span></p><div class="paizhao"><img src="http://demo.paopaoxi.com/app/category/cloth_df_150_150.png"><img src="http://demo.paopaoxi.com/app/category/cloth_df_150_150.png"><img src="http://demo.paopaoxi.com/app/category/cloth_df_150_150.png"></div><a href="#" class="btn-yellow butt2">拍照</a></div>';
			$('ul.price_ul li .addyidaninfo').on('click',function(){
				$(this).parent().find('.bb-ydinfo').append(ydhtml);
			});
			//选中衣服
			$('ul.price_ul li i').on('click',function(){
				$(this).parent().toggleClass( 'sel');
				 if($(this).parent().hasClass('sel')){
				 	$(this).parent().find('.bb-ydbox').show();
				 }else{
				 	$(this).parent().find('.bb-ydbox').hide();
				 }
			});
			
			//关闭地址列表对活框
			$('#address_box i.close').click(function(){
				$('#address_box').hide();
				$('#order_bg').hide();
			});
			
		});
		
		
		//删除衣单详情
		function guanbi(e){
			e.parent().remove();
		}
		//瑕疵
		function xiachi(e){
			
			
		}
		//附件
		function fujian(){
			
		}
	</script>
</body>
</html>